import { useTranslation } from 'react-i18next';
import Button from 'src/component/Button';
import Modal from 'src/component/Modal';
import { Action } from 'src/constant/Order';
import style from './ConfirmationModal.module.scss';

type Props = {
    isOpen: boolean;
    action?: Action;
    onClose: (isConfirm: boolean) => void;
};

const ConfirmationModal = ({ isOpen, action, onClose }: Props) => {
    const { t } = useTranslation();

    const messageMap = {
        [Action.Suspend]: "订单需上架请联系商务处理！",
        [Action.Unsuspend]: "订单需下架请联系商务处理！",
        [Action.Delete]: "确认要删除此广告？",
        [Action.Edit]: "订单需编辑请联系商务处理！",
    };

    return (
        <Modal open={isOpen} handleClose={() => onClose(false)}>
            <>
                <div>{messageMap[action ?? Action.Suspend]}</div>
                <div className={style.navigator}>
                    {action == "删除" ? (
                        <>
                            <Button appearance="outlined" onClick={() => onClose(false)}>
                                取消
                            </Button>
                            <Button onClick={() => onClose(true)}>
                                确认
                            </Button>
                        </>
                    ) : <>
                        <Button onClick={() => onClose(false)}>
                            关闭
                        </Button>
                    </>}
                </div>
            </>
        </Modal>
    );
};

export default ConfirmationModal;
